
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!doctype html>
<html>
<head>
    <title>Title</title>
    <jsp:include page="/_layout/_css.jsp"/>
    <link rel="stylesheet" href="${ctx}/resources/css/plugins/bootstrap-table/bootstrap-table.min.css"/>
    <link rel="stylesheet" href="${ctx}/resources/css/plugins/datapicker/datepicker3.css"/>
    <link rel="stylesheet" href="${ctx}/resources/js/plugins/datapicker/bootstrap-datepicker.js"/>
</head>
<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInRight">
        <row>
            <div class="col-sm-12">
                <div class="ibox-content">
                    <div class="btn btn-primary" onclick="adduser()">添加用户</div>
                    <table id="table"></table>

                </div>

            </div>
        </row>
    </div>
</body>
<div class="col-sm-12" id="pop" style="display:none">
    <div class="ibox float-e-margins">
        <div class="ibox-title">
            <h5>添加用户</h5>
        </div>
        <div class="ibox-content">
            <form class="form-horizontal m-t" id="commentForm" novalidate="novalidate">
                <div class="form-group">
                    <label class="col-sm-3 control-label">姓名：</label>
                    <div class="col-sm-8">
                        <input type="text" name="userName" class="form-control">
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-3 control-label">性别：</label>
                    <div class="col-sm-8">
                        <label class="radio-inline">
                            <input type="radio" name="gender" value="1"> 女
                        </label>
                        <label class="radio-inline">
                            <input type="radio" name="gender" value="2"> 男
                        </label>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-3 control-label">邮箱：</label>
                    <div class="col-sm-8">
                        <input id="curl" type="text" class="form-control" name="email">
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-3 control-label">生日：</label>
                    <div class="col-sm-8">
                        <div class="input-group date">
                            <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                            <input type="text" class="form-control" value="2014-11-11">
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-3 control-label">班级：</label>
                    <div class="col-sm-8">
                        <textarea id="ccomment" name="comment" class="form-control" required="" aria-required="true"></textarea>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-4 col-sm-offset-3">
                        <button class="btn btn-primary" type="submit">提交</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
<jsp:include page="/_layout/_script.jsp"/>
<script src="${ctx}/resources/js/plugins/bootstrap-table/bootstrap-table.min.js"/>
<script src="${ctx}/resources/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.js"></script>
<script>
    $.get('${ctx}/user/list',function (r) {
        $('#table').bootstrapTable({
            url: '${ctx}/user/list',
            columns: [{
                field: 'userName',
                title: '姓名'
            }, {
                field: 'gender',
                title: '性别',
                formatter:function (v1) {
                    if (v1==1){
                        return '男'
                    } else if(v1==2){
                        return '女'
                    }
                }
            }, {
                field: 'email',
                title: '邮件',
                formatter:function (v1) {
                    if (v1==0){
                        return '我是成小春'
                    } else if (v1==1){
                        return '是兄弟就来砍我'
                    } else if (v1==2){
                        return '我是古天乐'
                    } else if (v1==3){
                        return '我是渣渣辉'
                    }
                }
            }, {
                field: 'birthday',
                title: '生日'
            },{
                title: '操作',

                formatter:function (v1,v2) {
                    id=v2['id'];
                    return "<div class='btn btn-xs btn-danger' onclick='removeThis("+id+")'>删除<div>"
                }
            }],
            pagination:true,
            pageSize:2,
            pageList:[2,3,6],
            search:true,
            showColumns:true,
            showColumns:true,
            sidePagination:"server",
            queryParamsType:''
        });
    },'json')

    function removeThis(id){
        if (confirm("确定删除当前数据？")) {
            $.post('${ctx}/user/remove/'+id,function (r) {
              if(r['code']==200){
                  layer.msg("删除成功");
                  $('#table').bootstrapTable('refresh');
              }
            },'json');
        }
    }
    
    function adduser() {
        layer.open({
            title:'添加用户',
            type:1,
            content:$('#pop'),
            area:'50%'
        })
    }
    $('#date').datepicker({
        weekStart:1,
        language:"zh-CN"
    });
</script>
</html>
